{include file="common/header"}
<div id="app" v-cloak>
    <el-curd
        :field="field"
        :table-sort="{prop: 'sort', order: 'desc'}"
        :search-date="false"
        :search-status="[{label: '正常', value: 1}, {label: '屏蔽', value: 0}]"
        :search-catalog="catalog"
        save-title="新增轮播图"
        variable="banner">
    </el-curd>
</div>
<script>
    var catalog = tree.convertString({:json_encode($catalog)});
    new Vue({
        el: '#app',
        data() {
            return {
                catalog: catalog,
                field: [
                    {
                        prop: 'id', 
                        label: '编号', 
                        table: false,
                    },
                    {
                        prop: 'cover', 
                        label: '轮播图', 
                        table: {
                            label: '',
                            width: '60px', 
                            is: 'el-image'
                        },
                        form: {
                        	is: 'el-file-select', 
                        	type: 'image', 
                        	rules: [
                                {required: true,  message: '请选择轮播图'}
                            ]
                        },
                    },
                    {
                        prop: 'catalog_id', 
                        label: '轮播页面', 
                        table: {sort: true}, 
                        form: {
                            is: 'el-select',
                            child: {is: 'el-option', value: catalog, props:{label: 'title', value: 'id'}},
                            default: [],
                            filterable: true,
                            multiple: true,
                            rules: [
                                {required: true,  message: '请选择分类'}
                            ]
                        },
                    },
                    {
                        prop: 'show', 
                        label: '显示方式', 
                        table: {sort: true},
                        form: {
                            is: 'el-select',
                            default: 0, 
                            child: {
                                is: 'el-option', 
                                value:[
                                    {label:'都显示',value:0},
                                    {label:'电脑端',value:1},
                                    {label:'手机端',value:2},
                                ]
                            }, 
                            rules: [
                                {required: true,  message: '请选择显示方式'}
                            ]
                        }
                    },
                    {
                        prop: 'title', 
                        label: '标题介绍', 
                        table: false,
                    },
                    {
                        prop: 'c_title', 
                        label: '副标题', 
                        table: false, 
                    },
                    {
                        prop: 'url',
                        label: '链接地址', 
                        table: false,
                        form: {
                            is:'el-link-select', 
                            default: {},
                        },
                    },
                    {
                        prop: 'sort', 
                        label: '轮播排序', 
                        table: {is: 'el-input', sort: true},
                        form: {
                            default: 0, 
                            placeholder: '降序排序，值越大越靠前，留空则自动增长',
                        },
                    },
                    {
                        prop: 'description',
                        label: '简短描述',
                        table: false, 
                        form: {type: 'textarea'},
                    },
                    {
                        prop: 'status', 
                        label: '是否开启',  
                        table: {is: 'el-switch', sort: true},
                        form: {
                            is: 'el-switch',
                            default: 1, 
                        },
                    },
                    {
                        prop: 'content',
                        label: '详细介绍',
                        table: false, 
                        form: {
                            is: 'el-editor',
                        }
                    },
                ],
            }
        },
    });
</script>
{include file="common/footer"}